<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>amCharts examples</title>
<link rel="stylesheet" type="text/css" href="/static/css/base.css" />
<link rel="stylesheet" type="text/css" href="/static/css/changelists.css" />
<link rel="stylesheet" type="text/css" href="/static/css/dashboard.css" />
<link rel="stylesheet" type="text/css" href="/static/css/forms.css" />
<link rel="stylesheet" href="/static/js/style.css" type="text/css">
<script src="/static/js/amcharts.js" type="text/javascript"></script>
<script type="text/javascript">
	var chart;
	var legend;

	var chartData = JSON.parse('{{data}}');
	AmCharts.ready(function() {
		// PIE CHART
		chart = new AmCharts.AmPieChart();
		chart.dataProvider = chartData;
		chart.titleField = "name";
		chart.valueField = "value";
		chart.outlineColor = "#FFFFFF";
		chart.outlineAlpha = 0.8;
		chart.outlineThickness = 2;
		// this makes the chart 3D
		chart.depth3D = 15;
		chart.angle = 30;

		// WRITE
		chart.write("chartdiv");
	});
</script>
</head>
<div id="content1" class="flex">
  <div>
    <body style="margin: 30px;">
      <h3>[{{name}}] * 새벽 4시에 취합됨</h3>
      <b><img src="/static/img/text01.png" />{{totalUsers}} , <img src="/static/img/text02.png" />{{activeUsers}}</b>
      <div style="margin-right: 30px;">
        <br /> <b>&nbsp;&nbsp;&nbsp;&nbsp;<a href="/cs/statistics/?ratio={{ratio}}&delta={{delta-1}}"><img src="/static/img/prev1.png" /></a>{{date}} {% if delta<0 %}<a href="/cs/statistics/?ratio={{ratio}}&delta={{delta+1}}"><img src="/static/img/next1.png" /></a> {% endif %}
        </b>
      </div>
      <div id="chartdiv" style="width: 100%; height: 700px; margin: 10px;"></div>
  </div>
</div>
</body>
</html>

